import React from 'react';
import "./index.css";
import "../../Common/css/common.css"
import Blank from '../Blank'

export default class Drone extends React.Component{
    constructor (props){
        super();
        this.state={
            title:props.title,
            type:props.type,
            desc1:props.desc1,
            desc2:props.desc2,
            showBtn:(props.type!==undefined)?"":"none",
            src:props.src,
            onClick:props.onClick,
            id:props.id
        };
    }
    render(){
        return(
            <div className="GoodBox" id={this.state.id}>
                <div className="flexContainer">
                    <Blank/>
                    <img alt="goods" src="/assets/CA/ca.png" className="GoodBox_Ext_Msg"/>
                </div>
                <div className="middle GoodDronePic">
                    {/* <img alt="drone" src="/assets/Drone/drone.png"/> */}
                    <img alt="drone" className="Drone_Pic" src={this.state.src}/>
                </div>
                <span className="Drone_Btn" style={{display:this.state.showBtn}}>{this.state.type}</span>
                <div className="GoodBox_Name">{this.state.title}</div>
                <div className="GoodBox_Desc">{ this.state.desc1 }</div>
                <div className="GoodBox_Desc flexContainer">{ this.state.desc2 }<Blank/><img className="Drone_DeleteImg" src="/assets/CA/delete.png" alt="ca" onClick={this.state.onClick}/></div>
            </div>
        );
    }
}
